<link href="/static/css/gloab.css" rel="stylesheet">
    <style>
        @charset "utf-8";
        /* CSS Document */
        .main{width:1080px;min-width:1080px;margin:0 auto;}
        /*login and reg*/
        .reg-box-pan{padding:20px 40px 0px; width:100%;height:400px;}

        span .add_attachment {
                font-size: 80%;
                line-height: 2.5em;
        }
        .add_file_a{cursor:pointer;float:left;display: inline-block;width:30px;background: url("/static/img/icon_add.png") no-repeat center center;background-size:45%;}
        .delete_file{cursor:pointer;float:right;width:30px;background: url("/static/img/icon_del.png") no-repeat center center;background-size:45%;}
        .add_attachment:hover{
                 color:#E4393C;
                 text-decoration: underline;
        }
        .item{
            width:600px;
            margin:0 auto;
            margin-left:110px;
        }
    </style>
<div class="panel panel-default panel-h" style="background-color:#fff;">
<div class="panel-body">

<div class="login-box f-mt10 f-pb50"> 
    <div style="margin:0 auto;width:1000px;">
    	<div class="reg-box-pan display-inline">  
        	<div class="step">        	
                <ul>
                    <li class="col-xs-4 on"> 
                        <span class="num"><em class="f-r5" id="one"></em><a href="javascript:;" id="lisense_one"><i class="this_val">1</i></a></span>                	
                        <span class="line_bg lbg-r" id="one"></span>
                        <p class="lbg-txt">[['Create registration information'|translate]]</p>
                    </li>
                    {% if step_number >= 2 %}
                        <li class="col-xs-4 on"> 
                    {% else %}
                        <li class="col-xs-4">
                    {% endif %}
                        <span class="num"><em></em><a href="javascript:;" id="lisense_two"><i class="this_val">2</i></a></span>
                        <span class="line_bg lbg-l"></span>
                        <span class="line_bg lbg-r"></span>
                        <p class="lbg-txt two_font">[['Apply for authorization'|translate]]</p>
                    </li>
                    <li class="col-xs-4">
                        <span class="num"><em class="f-r5" id="three"></em><a href="javascript:;" id="lisense_three"><i class="this_val">3</i></a></span>
                        <span class="line_bg lbg-l" id="three"></span>
                        <p class="lbg-txt">[['complete registration'|translate]]</p>
                    </li>
                </ul>
            </div>
        	<div class="reg-box" id="verifyCheck" style="margin-top:50px;">
            	    <div class="part1">                	
                        <div class="item">
                            <span class="intelligent-label f-fl">&nbsp;</span>    
                            <div class="f-fl">
                                <a href="javascript:;" class="btn btn-blue f-r3" id="create_license">[['next'|translate]]</a>
                                       <p style="margin-top:20px;">此操作将产生所有节点的注册信息</p>
                            </div>
                        </div>                                  
                    </div>
                    <div class="part2" style="display:none">
                        <div class="item">
                            <span class="intelligent-label f-fl">&nbsp;</span>    
                            <div class="f-fl">
                               <a href="javascript:;" class="btn btn-blue f-r3" id="btn_part2">[['next'|translate]]</a>                         
                                <p style="margin-top:20px;">请将第一步生成的文件保存到本地，并以邮件形式发送给商务人员申请授权容量<br/>申请完成后点击下一步继续</p>
                            </div>
                        </div> 
                    </div>
                    <div class="part3" style="display:none">
                        <div class="item">
                            <span class="intelligent-label f-fl">&nbsp;</span>    
                            <p>选择已获得的认证文件包</p>
                            <div class="node_content" id="license_form">
                                 <form method="POST" class="register_submit" enctype="multipart/form-data">       
                                     <div class="error_tip upload_license"></div>
                                     <input type="file" id="license_file" name="license_file"/>
                                     <br>
                                 </form>       
                                <span class='add_att'>
                                <a class='add_file_a add_file_button'>&nbsp;</a>
                                <a href="#" class="add_attachment add_file_button" >添加其它文件</a>
                                </span>
                            </div>
                            <div class="f-fl">
                               <a href="javascript:;" class="btn btn-blue f-r3" id="btn_part3">[['next'|translate]]</a>                         
                            </div>
                        </div> <!-- item col-xs-12 -->
                    </div>           
            </div>
        </div>
        <div style="padding:0px 150px">
            <table id="colony_license_info"></table> 
        </div>
    </div>
</div>
</div> <!-- panel-body -->
</div> <!-- panel-default -->
<script>
$(function(){
    $(".contentpanel").find(".panel:first").css({'height':$(window).height()-80});
    if($(window).height()<750){
           $(".panel-h").css({'height':750});
    }
                {% if step_number <=1 %}
		    $(".part1").show();
                {% elif step_number == 2 %}
		    $(".part1").hide();
		    $(".part2").show();
                {% else %}
                {% endif %} 
                          
    $(".col-xs-4").each(function(){
        $(this).click(function(){
            if($(this).hasClass('on')==true){
                if($(this).find("i").text()==1){
                    $(".step li").eq(1).removeClass("on");
                    $(".step li").eq(2).removeClass("on");
                    $(".part2").hide();
                    $(".part3").hide();
		            $(".part1").show(); 
                };
                if($(this).find("i").text()==2){
                    $(".step li").eq(2).removeClass("on");
                    $(".part1").hide();
                    $(".part3").hide();
		            $(".part2").show(); 
                }; 
                if($(this).find("i").text()==3){
                    $(".part2").hide();
                    $(".part1").hide();
		            $(".part3").show(); 
                }; 
                }
                }); 
    });
    //第一页的确定按钮
	$("#btn_part1").click(function(){						
		//if(!verifyCheck._click()) return;
		$(".part1").hide();
		$(".part2").show();
		$(".step li").eq(1).addClass("on");
	});
	//第二页的确定按钮
	$("#btn_part2").click(function(){			
		$(".part2").hide();
		$(".part3").show();	
		$(".step li").eq(2).addClass("on");
	});	
	//第三页的确定按钮
        var form_validation=true;
	$("#btn_part3").click(function(){			
//		$(".part3").hide();
                 var bValid=true;
                  bValid =bValid&&check_license_file($("#license_file"));
                 if(bValid)
                  {  
                  if(form_validation){ 
                    $(".upload_license").text("正在提交中......").css({"display":"block","color":'#000'});  
                    form_validation=false;           
                         $(".register_submit").ajaxSubmit({  
                             type: 'post',  
                             url: "/license_upload" ,  
                             success: function(data){ 
                                if (data.reply.is_success){
                                    $(".upload_license").text('授权完成').css({"display":"block","color":'#000'});  
                                    form_validation=true;                                          
                                    $('#tb_event_mng').trigger("reloadGrid");
                                }else {
                                    error =  data.reply.error;
                                    $(".upload_license").text(error).css({"display":"block","color":'#000'});  
                                    var data= $('.licesen_uuid_dir').val();
                                    //$("#div_license_success").dialog("open"); 
                                    //$("#div_license_success").load('/success_license');
                                    //$.get("/license_registered/"+data,function(res){
                                    //     $(".success_license").css({"display":"none"});  
                                    //     $("#success_lice_lists").jqGrid('setGridParam',{page:1,url:"/help/registered_list/dd"}).trigger('reloadGrid');
                                    //     $(".colony_license_txt").hide();
                                    //    $('#colony_license_info').trigger("reloadGrid");
                                    //     $(".colony_license_txt_hide").show();
                                    //    $('#tb_event_mng').trigger("reloadGrid");
                                    //});
                                    form_validation=true;                                          
                                }
                              
                              },  
                             error: function(a,XmlHttpRequest, textStatus, errorThrown){  
                               // alert( "error");  
                               form_validation=true;           
                              }                             
                      }) 
                      }
                      else
                      {
                       $(".upload_license").text("正在提交中......").css({"display":"block","color":'#000'});  
                      }
                  } 
	});	
});
function showoutc(){$(".m-sPopBg,.m-sPopCon").show();}
function closeClause(){
	$(".m-sPopBg,.m-sPopCon").hide();		
}
         //生成授权
        $("#create_license").click(function(){
            var url = '/license_download'
                a =window.open(url)
                setTimeout(function(){$('#tb_event_mng').trigger("reloadGrid")},2000);
		$(".part1").hide();
		$(".part2").show();
		$(".step li").eq(1).addClass("on");
        })         
    $(".add_file_button").click(function(){
        input_file ='<input type="file" id="license_file" name="license_file"  style="width:420px;border:1px solid #d8dce5;margin:3px;float:left"/><a style="float:right" class="delete_file" title="删除">&nbsp; </a><br>'
        $('.register_submit').append(input_file)
    })
    $("#license_form").delegate(".delete_file","click",function(){
        $(this).prev('#license_file').remove()
        $(this).prev('br').remove()
        $(this).remove()
    })

$('#colony_license_info').jqGrid({
        url:'/license/grid',
        datatype: 'json',
        mtype: 'GET',
        styleUI:'Bootstrap',
        colNames:['编号','[["modal Recommended capacity"|translate]]','[["label used capacity"|translate]]','名称','[["label Has authorized"|translate]]','[["label Authorization state"|translate]]','>>','授权时间','到期时间','<<'],
        colModel :[
            {name:'id', index:'id', width:10, align:'left',sortable:false,hidden:true},
            {name:'all_size', index:'all_size', width:40, align:'left',sortable:false},
            {name:'size', index:'size', width:40, align:'left',sortable:false},
            {name:'name', index:'name', width:50, align:'left',sortable:false,hidden:true},  
            {name:'sized', index:'sized', width:50, align:'left',sortable:false},                
            {name:'status', index:'status', width:50, align:'left',sortable:false},
            {name:'more',index:'more',width:10,align:'left',sortable:false},
            {name:'get_date', index:'get_date', width:60, align:'left',sortable:false,hidden:true},
            {name:'past_date', index:'past_date', width:60, align:'left',sortable:false,hidden:true},   
            {name:'less',index:'less',width:10,align:'left',hidden:true,sortable:false},                             
        ],
        rowList:[10,20,30],
        rowNum :2000,
        sortname: 'id',
        sortorder: 'asc',
        viewrecords: true,
//        caption: '所有集群授权信息列表',
        altclass:'ui-priority-secondary',
        // altRows:true,
        height:200,
        width:670,
        gridComplete:function(){
            var ids=$(this).jqGrid('getDataIDs').length;
            $(this).find("td[aria-describedby=colony_license_info_size]").hide()
            $(this).find("td[aria-describedby=colony_license_info_size]").first().show().attr("rowspan",ids)
            $(this).find("td[aria-describedby=colony_license_info_all_size]").hide()
            $(this).find("td[aria-describedby=colony_license_info_all_size]").first().show().attr("rowspan",ids)
            $("#jqgh_colony_license_info_more").click(function(){
                  $("#colony_license_info").jqGrid('showCol',"get_date");              
                  $("#colony_license_info").jqGrid('showCol',"past_date");              
                  $("#colony_license_info").jqGrid('hideCol',"more");                       
                  $("#colony_license_info").jqGrid('showCol',"less");                       
                  $("#colony_license_info").setGridWidth(900);
            }) 
            $("#jqgh_colony_license_info_less").click(function(){
                  $("#colony_license_info").jqGrid('hideCol',"get_date");              
                  $("#colony_license_info").jqGrid('hideCol',"past_date");              
                  $("#colony_license_info").jqGrid('showCol',"more");                       
                  $("#colony_license_info").jqGrid('hideCol',"less");                       
                  $("#colony_license_info").setGridWidth(670);
            }) 
           },               
});

</script>
